#limbo {
    width: $limbo-card-w;
    margin: 0 auto;
}
@media (min-width: $limbo-card-w*2) {
    #limbo {
        width: $limbo-card-w*2;
    }
}

@media (min-width: $limbo-card-w*3) {
    #limbo {
        width: $limbo-card-w*3;
    }
}

@media (min-width: $limbo-card-w*4) {
    #limbo {
        width: $limbo-card-w*4;
    }
}

@media (min-width: $limbo-card-w*5) {
    #limbo {
        width: $limbo-card-w*5;
    }
}

@media (min-width: $vw-xxlarge) {
    #limbo {
        width: $limbo-card-w*6;
    }
}

[class *="-item-card"] {
    margin: 10px;
    width: $limbo-card-w - 20px;
}

.limbo-item-card {
    border: 1px solid $ml-border-color;
    background-color: #FFF;
    overflow: hidden;
    @include boxSizing(border-box);
    @include borderRadius();
    @include boxShadow(0 1px 2px rgba(40,40,40,0.1));
    
    .details {
        border-top: 1px solid $ml-border-color-alt;
        height: 40px;
        padding: 0 13px;
        h5 {
            float: left;
            margin: 0;
            width: 70%;
            height: 40px;
            line-height: 40px;
            font-size: $fz-normal;
            font-weight: $fw-normal;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .price {
            float: right;
            width: 30%;
            height: 40px;
            line-height: 40px;
            text-align: right;
            font-size: $fz-normal;
            font-weight: $fw-bold;
            color: $ml-secondary-color;
        }
    }
    .owner {
        float: left;
        position: relative;
        padding: 8px 13px 0 60px;
        img {
            position: absolute;
            top: 8px;
            left: 13px;
            width: 34px;
            height: 34px;
        }
        .name {
            height: 17px;
            line-height: 17px;
            font-size: $fz-small;
            font-weight: $fw-semibold;
        }
        .location {
            font-size: $fz-small;
            color: $ml-gray;
        }
    }
    .fav-me{
        float: right;
        margin: 8px;
        border: none;
        width: 34px;
        height: 34px;
        line-height: 34px;
        font-size: 20px;
        color: $ml-gray;
        background-color: transparent;
    }
    &.fav .fav-me {
        color: $ml-fav-color;
        i:before {
            content: "\f004";
        }
    }
    &:hover, &:focus {
        border-color: lighten($ml-main-color, 30%);
    }
}

.limbo-card-img {
    display: block;
    position: relative;
    overflow: hidden;
    
    img {
        display: block;
        width: $limbo-card-w - 22px;
        height: auto;
        @include transition (0.2s, all, linear);
    }
    
    .see-more {
        display: block;
        opacity: 0;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        text-align: center;
        background-color: rgba($ml-main-color, 0.2);
        p{
            color: #FFF;
            text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
            @include verticalAlign();
        }
    }
}

.limbo-card-link{
    display: block;
    &:hover {
        .see-more {
            opacity: 1;
        }
    }
}

.limbo-card-foot {
    border-top: 1px solid $ml-border-color-alt;
    height: 50px;
}

.advertising-item-card {
    text-align: center;
    padding: 30px 0;
}